var uid = localStorage.getItem('id');
window.onload = function () {
    // 获取购物车列表
    /*
      接口地址：http://jx.xuzhixiang.top/ap/api/cart-list.php
        接口请求方式：get
        接口参数：
            id  用户id
    */
    //    获取用户id
    goodsCarList();
    function goodsCarList() {
        var url = "http://jx.xuzhixiang.top/ap/api/cart-list.php";
        axios.get(url, { params: { id: uid } }).then(res => {
            console.log(res.data.data);
            var goodsArr = res.data.data;
            var goodStr = '';
            goodsArr.forEach(item => {
                goodStr += `
                     <tr>
                        <td>
                            <input type="checkbox" checked="checked" class="check">
                            <img src="${item.pimg}" alt="">
                        </td>
                        <td>${item.pname}</td>
                        <td>${item.pdesc}</td>
                        <td >￥<span class="pprice">${item.pprice}</apan></td>
                        <td>
                             <div class="num">
                                <button class="minus">—</button>
                                <input type="text" class='pnum' value="${item.pnum}">
                                <button class="add">+</button>
                            </div>
                            
                            </td>
                        <td><button class="delBtn" onclick="delGoods(${item.pid})">删除</button></td>
                     </tr>
                    `;
            });
            document.querySelector('table').innerHTML += goodStr;
            var pnum = document.querySelectorAll('.pnum');
            var pprice = document.querySelectorAll('.pprice');
            var minus = document.querySelectorAll('.minus');
            var add = document.querySelectorAll('.add');
            var check = document.querySelectorAll('.check');
            var data = res.data.data;

            num(minus, pnum, add, pprice, data, check);
            mathSum(pnum, pprice);
        })

    }
}
// 计算商品价格
function mathSum(pnum, pprice) {
    var sum = 0;
    pnum.forEach((item, index) => {
        sum += parseFloat(pnum[index].value) * parseFloat(pprice[index].innerHTML);
        document.querySelector('.money').innerHTML = sum;
    })
}

/*
 接口地址：http://jx.xuzhixiang.top/ap/api/cart-update-num.php
    接口请求方式：get
    接口参数：
        uid  用户id
        pid  商品id
        pnum  要添加的商品数量
*/
function num(minus, pnum, add, pprice, data, check) {
    // 点击减少按钮触发
    minus.forEach((item, index) => {
        minus[index].onclick = function () {
            if (pnum[index].value <= 1) {
                pnum[index].value = 1;
                alert("商品不能小于1哦");
            } else {
                var url = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
                var uid = data[index].uid;
                var pid = data[index].pid;
                var pnums = parseInt(pnum[index].value) - 1;
                axios.get(url, { params: { uid, pid, pnum: pnums } }).then(res => {
                    pnum[index].value = parseInt(pnum[index].value) - 1;
                    mathSum(pnum, pprice);
                })
            }
        }

    })
    // 点击加号按钮时触发
    add.forEach((item, index) => {
        add[index].onclick = function () {
            var url = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
            var uid = data[index].uid;
            var pid = data[index].pid;
            var pnums = parseInt(pnum[index].value) + 1;
            axios.get(url, { params: { uid, pid, pnum: pnums } }).then(res => {
                console.log(res);
                pnum[index].value = parseInt(pnum[index].value) + 1;
                mathSum(pnum, pprice);
            })

        }
    })
    // 直接修改数量触发
    pnum.forEach((item, index) => {
        pnum[index].onchange = function () {
            if (pnum[index].value == 0) {
                alert("商品不能为0哦");
                pnum[index].value = 1;
            }
            var url = "http://jx.xuzhixiang.top/ap/api/cart-update-num.php";
            var uid = data[index].uid;
            var pid = data[index].pid;
            var pnums = parseInt(pnum[index].value);
            axios.get(url, { params: { uid, pid, pnum: pnums } }).then(res => {
                mathSum(pnum, pprice);
            })
        }
    })

    // 复选框选中价格计算
    check.forEach((item, index) => {
        check[index].onchange = function () {
            var sum = 0;
            if (item.checked == false) {
                var price = pprice[index].innerHTML;
                var num = pnum[index].value;
                sum += parseFloat(price) * parseFloat(num);
                document.querySelector('.money').innerHTML -= sum;
            } else {
                var price = pprice[index].innerHTML;
                var num = pnum[index].value;
                sum += parseFloat(price) * parseFloat(num);
                var money = document.querySelector('.money').innerHTML;
                document.querySelector('.money').innerHTML = sum + parseFloat(money);
            }
        }
    })
}
// 删除购物车商品
/*
  接口地址：http://jx.xuzhixiang.top/ap/api/cart-delete.php
    接口请求方式：get
    接口参数：
        uid  用户id
        pid  商品id
*/
function delGoods(pid) {
    if (confirm('您确定要从购物车中移除该商品吗？')) {
        var delUrl = "http://jx.xuzhixiang.top/ap/api/cart-delete.php";
        axios.get(delUrl, { params: { pid, uid } }).then(res => {
            // console.log(res);
            alert(res.data.msg);
            location.reload();
        })
    }
}
